<div id="style-field-type-table">
    <table class="table">
        <tr>
            <th>Type</th>
            <th>Syntax</th>
            <th>Description</th>
        </tr>
        <tr>
            <td>Alignment<a id="alignment"></a></td>
            <td>{ top<br>
                | bottom<br>
                | left<br>
                | right<br>
                | center }*
            </td>
            <td>To-Do</td>
        </tr>
        <tr>
            <td>Background<a id="background"></a></td>
            <td>{ <a href="#brush">Brush</a><br>
                | <a href="#alignment">Alignment</a>
                }*
            </td>
            <td>To-Do</td>
        </tr>
        <tr>
            <td>Border<a id="border"></a></td>
            <td>{ <a href="#border-style">Border Style</a><br>
                | <a href="#length">Length</a><br>
                | <a href="#brush">Brush</a>
                }*
            </td>
            <td>To-Do</td>
        </tr>
        <tr>
            <td>Border Style<a id="border-style"></a></td>
            <td>dashed<br>
                | dot-dash<br>
                | dot-dot-dash<br>
                | dotted<br>
                | double<br>
                | groove<br>
                | inset<br>
                | outset<br>
                | ridge<br>
                | solid<br>
                | none
            </td>
            <td>To-Do</td>
        </tr>
        <tr>
            <td>Box Colors<a id="box-colors"></a></td>
            <td><a href="#brush">Brush</a>{1, 4}</td>
            <td>To-Do</td>
        </tr>
        <tr>
            <td>Box Lengths<a id="box-lengths"></a></td>
            <td><a href="#length">Length</a>{1, 4}</td>
            <td>To-Do</td>
        </tr>
        <tr>
            <td>Brush<a id="brush"></a></td>
            <td>
                <a href="#color">Color</a> |
                <a href="#gradient">Gradient</a>
            </td>
            <td>To-Do</td>
        </tr>
        <tr>
            <td>Color<a id="color"></a></td>
            <td>{ rgb(r, g, b)<br>
                | rgba(r, g, b, a)<br>
                | hsv(h, s, v)<br>
                | hsva(h, s, v, a)<br>
                | #rrggbb<br>
                | CSS Color Name }*
            </td>
            <td>To-Do</td>
        </tr>
        <tr>
            <td>Font<a id="font"></a></td>
            <td>( <a href="#font-style">Font Style</a><br>
                | <a href="#font-weight">Font Weight</a> ){0, 2}<br>
                <a href="#font-size">Font Size</a> String
            </td>
            <td>To-Do</td>
        </tr>
        <tr>
            <td>Font Size<a id="font-size"></a></td>
            <td><a href="#length">Length</a></td>
            <td>To-Do</td>
        </tr>
        <tr>
            <td>Font Style<a id="font-style"></a></td>
            <td>normal<br>
                | italic<br>
                | oblique
            </td>
            <td>To-Do</td>
        </tr>
        <tr>
            <td>Font Weight<a id="font-weight"></a></td>
            <td>normal<br>
                | bold<br>
                | 100<br>
                | 200<br>
                | ...<br>
                | 900
            </td>
            <td>To-Do</td>
        </tr>
        <tr>
            <td>Gradient<a id="gradient"></a></td>
            <td>lineargradient<br>
                | radialgradient
            </td>
            <td>To-Do</td>
        </tr>
        <tr>
            <td>Length<a id="length"></a></td>
            <td><a href="#number">Number</a>( px | pt<br>| em | ex )?</td>
            <td>To-Do</td>
        </tr>
        <tr>
            <td>Number<a id="number"></a></td>
            <td>integer | real</td>
            <td>To-Do</td>
        </tr>
        <tr>
            <td>Origin<a id="origin"></a></td>
            <td>margin<br>
                | border<br>
                | padding<br>
                | content
            </td>
            <td>To-Do</td>
        </tr>
        <tr>
            <td>Radius<a id="radius"></a></td>
            <td><a href="#length">Length</a>{1, 2}</td>
            <td>To-Do</td>
        </tr>
    </table>
</div>
